<template>
  <div>
    <basic-container>
      <curd-title :title="'基本信息'" />
      <avue-form ref="form" :option="option" v-model="form">
        <template slot="materialClassify">
          <material-classify v-model="form.materialClassify" :disabled="['view'].includes(type)" />
        </template>
      </avue-form>
    </basic-container>
    <template v-if="flag">
      <basic-container>
        <curd-title :title="'模版内容'" />
        <avue-crud
          :table-loading="loading"
          :option="quotaOption"
          v-model="templateForm"
          :data="data"
          :before-open="beforeOpen"
          @on-load="onLoad"
          @row-save="rowSave"
          @row-update="rowUpdate"
          @row-del="rowDel"
          @selection-change="selectionChange"
        >
          <template slot="principalForm">
            <leading v-model="templateForm.principal" />
          </template>
        </avue-crud>
      </basic-container>
    </template>
  </div>
</template>

<script>
import CurdTitle from '@/components/base/title'
import { option, quotaOpt } from '@/option/tenant/supplier/audit-template-form'
import { getDeptTree, getDeptLazyTree } from '@/api/system/dept'
import { submit, detail } from '@/api/supplier/audittemplate'
import website from '@/config/website'
export default {
  name: 'QuotaForm',
  props: ['type', 'templateType', 'params'],
  components: {
    CurdTitle
  },
  data() {
    return {
      form: {},
      option: option.call(this),
      loading: false,
      quotaOption: { ...quotaOpt.call(this), operatingButtons: this.getOperatingButtons },
      checkIndex: [],
      data: [
        {
          id: 1,
          name: 'xxx',
          quotaRemark: 'xxxxxxxxx',
          score: '33',
          responsePerson: 'xx',
          children: [
            {
              id: 2,
              quotaName: 'xxx',
              quotaRemark: 'xxxxxxxxx',
              score: '33',
              responsePerson: 'xx',
              children: [
                {
                  id: 3,
                  quotaName: 'xxx',
                  quotaRemark: 'xxxxxxxxx',
                  score: '33',
                  responsePerson: 'xx'
                },
                {
                  id: 4,
                  quotaName: 'xxx',
                  quotaRemark: 'xxxxxxxxx',
                  score: '33',
                  responsePerson: 'xx'
                }
              ]
            }
          ]
        }
      ],
      templateForm: {},
      flag:false
    }
  },
  mounted() {
    if (['edit', 'view'].includes(this.type)) {
      return this.getDetail(this.params.id)
    }
    if (['add'].includes(this.type)) {
      return this.$emit('update:buttons', [
        {
          text: '保存并下一步',
          callback: this.handleNext
        },
        {
          text: '取消',
          type: 'default',
          callback: () => {
            this.$emit('update:visible', false)
          }
        }
      ])
    }
  },
  methods: {
    beforeOpen(done, type) {
      this.getDept()
      done()
    },
    getDept() {
      getDeptTree(website.tenantId).then(res => {
        const column = this.findObject(this.quotaOption.column, 'deptCode')
        column.dicData = res.data.data
      })
    },
    selectionChange(row) {
      this.checkIndex = row.map(v => v.$index)
    },
    deleteGroup() {
      this.data = this.data.filter(item => !this.checkIndex.includes(item.$index))
    },
    onLoad() {},
    refreshFactoryChange() {
      this.onLoad()
    },
    rowDel(row) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          console.log(row)
          // this.data.splice(row.$index, 1)
        })
        .then(() => {
          this.$message({
            type: 'success',
            message: '操作成功!'
          })
        })
    },
    handleNext() {
      this.flag = true
      this.$emit('update:buttons', [
        {
          text: '保存',
          callback: this.handleSave
        },
        {
          text: '取消',
          type: 'default',
          callback: () => {
            this.$emit('update:visible', false)
          }
        }
      ])
    }
  }
}
</script>

<style></style>
